export default {
  data () {
    return {
      categoriesList: [],
      // 展示添加分类对话框
      dialogAddCatVisible: false,
      // 添加分类的对象
      addCatForm: {
        // 分类名称
        cat_name: '',
        // 父级名称(多个父级)
        cat_pid_arr: []
      },
      // 级联选择器的数据
      options: [],
      // 指定级联选择器将要读取的名称
      defaultProps: {
        value: 'cat_id',
        label: 'cat_name'
      },
      options1: [
        {
          value: 'ziyuan',
          label: '资源',
          children: [
            {
              value: 'axure',
              label: 'Axure Components'
            },
            {
              value: 'sketch',
              label: 'Sketch Templates'
            },
            {
              value: 'jiaohu',
              label: '组件交互文档'
            }
          ]
        }
      ]
    }
  },
  created () {
    this.loadCategoriesList() // 加载 type=3
    this.loadCategoriesList2() // 加载 type=2
  },
  methods: {
    /**
     * 加载分类数据
     */
    async loadCategoriesList () {
      let res = await this.$axios.get('categories', {
        params: {
          type: 3,
          pagenum: 1,
          pagesize: 5
        }
      })

      this.categoriesList = res.data.data.result
    },
    /**
     * 点击添加分类  展示添加分类对话框
     */
    showAddCatDialog () {
      this.dialogAddCatVisible = true
    },
    /**
     * 加载分类数据 (二层 )
     */
    async loadCategoriesList2 () {
      let res = await this.$axios.get('categories', {
        params: {
          type: 2
        }
      })
      console.log(res.data.data)
      this.options = res.data.data
    },
    /**
     * 开始添加分类
     */
    async addCat () {
      /* eslint-disable */
      const { cat_name, cat_pid_arr } = this.addCatForm

      /**
        *
        cat_pid: , 就是只要父id,不要爷爷的id (数组的最后一个元素)
        cat_name: '', // 分类名称
        cat_level: '' // 分类层级 (数组的长度)
        */

      let res = await this.$axios.post('categories', {
        cat_pid: cat_pid_arr[cat_pid_arr.length - 1],
        cat_name,
        cat_level: cat_pid_arr.length // 分类层级
      })

      // 隐藏对话框
      this.dialogAddCatVisible = false

      // 提示
      this.$message({
        message: res.data.meta.msg,
        type: 'success'
      })

      // 刷新列表
      this.loadCategoriesList()
    }
  }
}
